<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Flex布局知识点</title>
</head>
<body>
    <!-- 
    如何触发弹性盒子
        给父元素添加display属性取值为flex
            1. 父元素触发弹性盒子之后，子元素默认横向显示
                 父元素触发弹性盒子之后，子元素会横向显示，类型于浮动，不是浮动，与浮动没有关系
                 不会影响孙子辈的元素
            2. 触发弹性盒子之后，会改变子元素的元素类型，会让子元素变成块级元素
            3. 触发弹性盒子之后，如果只有一个子元素，给子元素添加margin:auto的时候，
               子元素会位于水平垂直居中位置显示
    -->
</body>
</html>